<template>
	<view class="">
		<up-swipe-action>
			<up-swipe-action-item @click="swipeClick" :options="getOption(index)" v-for="(chat,index) in chatList"
				:key="chat.text" :index="chat.text" :name="index">
				<chat-item :chat="chat" :is-company="isCompany" :source-type="sourceType"></chat-item>
			</up-swipe-action-item>
		</up-swipe-action>
		<view style="height: 90px;">
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			chatList: {
				type: Array,
				default: () => []
			},
			type: {
				type: String,
				default: "PRIVATE"
			},
			sourceType: {
				type: Number,
				required: true
			},
			isCompany: {
				type: Boolean,
				default: false
			},
		},
		methods: {
			getOption(index) {
				const chat = this.chatList[index]
				return [{
						text: chat.originalData.onTop ? '取消' : '置顶',
						style: {
							backgroundColor: '#3c9cff'
						}
					},
					{
						text: '删除',
						style: {
							backgroundColor: '#f56c6c'
						}
					}
				]
			},
			/**
			 * 处理聊天列表滑动操作点击事件
			 * @param {Object} data - 滑动操作的数据
			 * @param {number} data.index - 按钮的索引（0: 置顶, 1: 删除）
			 * @param {number} data.name - 聊天单元格的索引
			 */
			swipeClick(data) {
				console.log("data",data)
				const {
					index, // 按钮的索引
					name //聊天单元格的索引
				} = data
				const chat = this.chatList[name]
					switch (index) {
						case 1:
							this.chatStore.removeChatByTypeAndId(chat.type,chat.targetId);
							break;
						case 0:
							this.chatStore.moveTopByTargetId(this.chatList[name].targetId);
							break;
						default:
							break;
					}
			}
		},
		options: {
			styleIsolation: 'shared'
		}
	}
</script>

<style lang="scss">
	:deep(.u-swipe-action-item__right) {
		height: 96% !important;
		top: 1px !important;
	}

	.swipe-action {
		&__content {
			&__text {
				font-size: 15px;
				padding-left: 30rpx;
			}
		}
	}
</style>